import Taro, {Component} from "@tarojs/taro";
import {View, Text} from "@tarojs/components";
import {toJS} from 'mobx'
import {inject, observer} from '@tarojs/mobx'
import {IStoreProps} from '../../store/Stores'
import { pageSize, subtime} from '../../utils/common'

import './index.less'

// 购买记录
interface IHomeProps extends IStoreProps {}

@inject("stores")
@observer
class Company extends Component<IHomeProps> {
  constructor(porps) {
    super(porps)
  }

  state = {
    totalCount:0,
    items:[],
    pageIndex:1,
    pageSize,
  }

  componentWillMount(): void {
    Taro.setNavigationBarTitle({ title:'购买记录' })
    this.getUserBuyAgencyLeval()
  }

  getUserBuyAgencyLeval() {
    let { userStore } = this.props.stores
    let { pageIndex, pageSize } = this.state
    userStore.getUserBuyAgencyLeval({
      pageIndex,pageSize,
      callback: res => {
        if (pageIndex === 1) {
          this.setState({totalCount: toJS(res.totalCount), items: toJS(res.items)})
        }else {
          const { items } = this.state;
          items.push(...res.items || []);
          this.setState({totalCount: res.totalCount, items})
        }
      }
    })
  }

  onReachBottom(): void {
    let {totalCount, pageSize, pageIndex} = this.state
    const {loading} = this.props.stores.homeStore;
    if (totalCount > pageIndex * pageSize && !loading) {
      this.setState({
        pageIndex: pageIndex + 1
      }, () => {
        this.getUserBuyAgencyLeval()
      })
    }
  }

  render() {
    let { items } = this.state
    return (
      <View className='my-my_integral'>
        {items.length>0&&
          items.map(item => {
            return(
              <View className='list-19-item' key={item.agencyAmount}>
                <View className='l'>
                  <View className='list-title'>建务通{item.agencyLevelView}(1年)</View>
                  <View className='list-info'>{subtime(item.payTime)}</View>
                </View>
                <View className='r'>
                  <Text className='money'>-{item.agencyAmount}元</Text>
                </View>
              </View>
            )
          })
        }
        {items.length<=0&&<View className='page-none-info'>您还没有相关购买记录~</View>}
      </View>
    )
  }
}

export default Company
